import React from 'react';  
import { Spin } from 'antd';  
  
// 全屏遮罩组件的CSS样式  
const fullscreenMaskStyles: React.CSSProperties = {  
  position: 'fixed',  
  top: 0,  
  left: 0,  
  width: '100%',  
  height: '100%',  
  zIndex: 9999, // 确保遮罩层在最高层  
  display: 'flex',  
  justifyContent: 'center',  
  alignItems: 'center',  
  backgroundColor: 'rgba(0, 0, 0, 0.5)', // 半透明黑色背景  
};  
  
// 全屏加载遮罩组件  
const FullscreenLoading = ({ showLoading = false, loadingTip = 'Loading' }) => {  
  const maskStyle = showLoading ? fullscreenMaskStyles : { display: 'none' };  
  
  return (  
    <div style={maskStyle}>  
      {showLoading && (  
        <div>  
          <Spin size="large" tip={loadingTip}></Spin>  
        </div>  
      )}  
    </div>  
  );  
};  
  
export default FullscreenLoading;